﻿/**
 * @author Jovi
 * @date 2014/12/18 16:18
 * @blog http://blog.sina.com.cn/u/2649689564
 */

(function($) {
	var jsonObj = {};
	$.fn
			.extend({
				treemenu : function() {
					var parameter = arguments[0];
					// 如果参数是json格式就执行初始化操作
					var deep;
					if ((typeof (parameter) == "object"
							&& Object.prototype.toString.call(parameter)
									.toLowerCase() == "[object object]" && !parameter.length)) {
						var $treemenu = $(this);
						var $treemenuId = $treemenu.attr('id');
						jsonObj = parameter.jsondata;
						init($treemenu, parameter.mousemove, parameter.deep);
						treeMenuBuild("root", "", parameter.jsondata, $treemenu);
					} else {
						switch (parameter) {
						case "getIndex":
							return $(this).find(".content").attr("index");
							break;
						case "getDeep":
							return $(this).find("#JD-stock").attr("deep");
							break;
						case "getParent":
							return $(this).find(".content").attr("parentid");
							break;
						case "getLabel":
							return $(this).find(".content").attr("itemlabel");
							break;
						case "getText":
							return $(this).find(".title").attr("value");
							break;
						case "setText":
							buildDivForText(arguments[1], jsonObj, $(this));
							break;
						case "destroy":
							deep = $(this).find("#JD-stock").attr("deep");
							mousemove = false;
							reLoad($(this), jsonObj, mousemove, deep);
							break;
						case "reLoad":
							mousemove = arguments[1].mousemove;
							deep = arguments[1].deep;
							reLoad($(this), jsonObj, mousemove, deep);
							buildDivForText(arguments[1].text, jsonObj, $(this));
							break;
						}
					}

				}
			});

	/** 初始化时创建默认div */
	function init($treemenu, mousemove, deep) {
		// 创建显示文本标题的div
		var $selector = $treemenu.find("#store-selector");
		if (deep === null || deep === undefined) {
			deep = 999999;
		}
		var head = new Array();
		head.push('<div class="close"></div>');
		head.push('<div class="text"><div class="title"></div><b></b></div>');
		$selector.append(head.join(""));
		// 创建显示各个父类id为XXX的子项页面div
		var content = new Array();
		content
				.push('<div class="content" itemLabel="" itemId="" itemValue="" parentId="">');
		content.push('<div data-widget="tabs" class="JD-stock" id="JD-stock"');
		content.push('deep="' + deep + '">');
		content.push('<div class="tabs">');
		content.push('<ul class="tab" id="tab">');
		content.push('</ul></div>');
		content.push('</div></div>');
		$selector.append(content.join(""));
		// 找到文本标题对象
		var $textObj = $treemenu.find(".text");
		// 找到关闭窗口对象
		var $closeObj = $treemenu.find(".close");
		// 根据传入参数决定显示选项页面效果
		if (mousemove) {
			$textObj.on("mousemove", function() {
				$(this).parent().addClass("hover");
			});
		} else {
			$textObj.on("click", function(event) {
				$(this).parent().addClass("hover");
				event.stopPropagation();
			});
			$treemenu.find(".content").bind("mouseleave", function() {
				$("html").bind("click", function() {
					$textObj.parent().removeClass("hover");
				});
			});
		}
		// 绑定关闭窗口事件
		$closeObj.on("click", function(event) {
			$(this).parent().removeClass();
			event.stopPropagation();
		});

	}

	/** 动态生成div 根据传入的参数创建parentId为选中的项的id，也就是将生成所有id为 parentId的子项页面 */
	function treeMenuBuild(thiskey, parentkey, jsondata, $treemenu) {
		var deep = $treemenu.find("#JD-stock").attr("deep");
		var isOk = false;
		var index = 0;
		var jsonObj = jsondata;
		var $tabs = $treemenu.find("#JD-stock div[class!='tabs']");
		// 判断parentId这个id 是否存在子项
		$tabs.each(function(i) {
			var itemValue = $(this).attr("id");
			for ( var key in jsonObj) {
				if (key === itemValue) {
					jsonObj = jsonObj['' + key];
				}
			}
		});
		// 将json对象转换为字符串
		var jsonStr = JSON.stringify(jsonObj['' + thiskey]);
		// 判断该json是否存在值
		if (jsonStr !== null && jsonStr !== "{}") {
			isOk = true;
		}
		// 如果id为parentId没有子项那么就返回
		if (!isOk) {
			// 关闭选项div窗口
			$treemenu.find("#store-selector").removeClass("hover");
			return isOk;
		}
		if (thiskey !== null && thiskey !== "root") {
			index = Number($treemenu.find("#" + parentkey).attr("index")) + 1;
		}
		var mc = new Array();
		mc.push('<div index="' + index);
		mc.push(' "data-widget="tab-content" id="' + thiskey);
		mc.push('" item-parent="' + parentkey);
		mc.push('" style="display: block;">');
		mc.push('<ul class="area-list" id="list">');
		mc.push('</ul>');
		mc.push('</div>');
		$treemenu.find("#JD-stock").append(mc.join(""));
		if (parentkey !== null && parentkey !== "") {
			jsonObj = jsonObj['' + thiskey];
		}
		for ( var key in jsonObj) {
			var li = new Array();
			li.push('<li><a href="#none"');
			li.push(' item-value="');
			li.push(key + '">' + key + '</a></li>');
			$treemenu.find("#" + thiskey + " #list").append(li.join(""));
		}
		var li = new Array();
		li.push('<li  id="parent' + thiskey + '"');
		li.push(' index="' + index + '" data-widget="tab-item" class="curr">');
		li.push('<a href="#none" class="hover">');
		li.push('<em>请选择</em>');
		li.push('</a>');
		li.push('</li>');
		$treemenu.find("#tab").append(li.join(""));
		// 找到每一项的对象
		var $aObj = $treemenu.find("#" + thiskey + " #list a");
		// 找到每一个选项页的标题对象
		var $liObj = $treemenu.find("#parent" + thiskey);
		// 为每个项绑定点击事件
		$aObj.on("click",
				function(event) {
					var itemValue = $(this).attr("item-value");
					var itemLabel = $(this).html();
					// 保存选中的值
					var parentId = $(this).parent().parent().parent()
							.attr("id");
					var index = $(this).parent().parent().parent()
							.attr("index");
					if (index < deep) {
						var isOk = treeMenuBuild(itemValue, thiskey, jsondata,
								$treemenu);
						if (isOk) {
							$treemenu.find("#parent" + thiskey + " em").html(
									itemLabel);
							// 将id为dataId所在的页面的标题不再获得光标
							$treemenu.find("#parent" + thiskey).removeClass(
									"curr");
							$(this).parent().parent().parent().css("display",
									"none");
						}
						// 重新设置文本标题
						setText(itemLabel, $treemenu);
					} else {
						var title = $treemenu.find(".title");
						setText(itemLabel, $treemenu);
						// 关闭选项div窗口
						$treemenu.find("#store-selector").removeClass("hover");
					}
					$treemenu.find(".content").attr("itemLabel", itemLabel)
							.attr("parentId", parentId).attr("index", index);
					event.stopPropagation();
				});
		// 为每一个选项页的标题对象绑定点击事件
		$liObj.on("click", function(event) {
			// 将该选项页标题之后的标题全部移除
			$(this).nextAll().remove();
			// 获得标题为该父类id（index）的选项的页面对象，将它之后的全部选项的页面移除
			$treemenu.find("#" + thiskey).css("display", "block").nextAll()
					.remove();
			// 获得光标，显示该页内容
			$(this).addClass("curr");
			event.stopPropagation();
		});
		return isOk;
	}

	/** 设置标题 */
	function setText(title, $treemenu) {
		var $title = $treemenu.find(".title");
		// 用于储存新的显示文本标题
		var textTitle = "";
		var textTitleValue = "";
		// 获得所有分页的标题
		var $titles = $treemenu.find("#tab li");
		// 遍历得到每一个分页的标题，将其追加得到显示文本标题
		$titles.each(function() {
			var $em = $(this).find("em");
			var id = $(this).attr("data-index");
			if ($em.html() !== null && $em.html() !== "请选择"
					&& $titles.length != 1) {
				textTitle += $em.html();
				if (textTitleValue === "") {
					textTitleValue = $em.html();
				} else {
					textTitleValue += "." + $em.html();
				}
			}
		});
		// 如果该选择项的值存在则不再追加
		if (textTitleValue.indexOf(title) === -1) {
			textTitleValue += "." + title;
		}
		// 如果该选择项的id存在则不再追加
		if (textTitle.indexOf(title) === -1) {
			textTitle += title;
		}
		// 将显示文本标题设置为新标题
		$title.html(textTitle);
		// 设置所有选中项的值
		$title.attr("value", textTitleValue);
	}

	/** 根据提供的文本创建 */
	function buildDivForText(text, jsondata, $treemenu) {
		var values = text.split(".");
		$treemenu.find("#parentroot").nextAll().remove();
		$treemenu.find("#root").nextAll().remove();
		var deep = $("#JD-stock").attr("deep");
		for (var i = 0; i <= deep; i++) {
			if (i < values.length) {
				var thiskey = values[i];
				var parentkey = (i == 0 ? "root" : values[i - 1]);
				var isOk = treeMenuBuild(thiskey, parentkey, jsondata,
						$treemenu);
				// 重新设置文本标题
				setText(thiskey, $treemenu);
				if (isOk) {
					$treemenu.find("#parent" + parentkey + " em").html(thiskey);
					// 将id为dataId所在的页面的标题不再获得光标
					$treemenu.find("#parent" + parentkey).removeClass("curr");
					$("#" + parentkey).css("display", "none");
				}
				// 关闭选项div窗口
				$treemenu.find("#store-selector").removeClass("hover");
				// 获取下标
				var index = $("#" + parentkey).attr("index");
				// 赋值
				$treemenu.find(".content").attr("itemLabel", thiskey).attr(
						"parentId", parentkey).attr("index", index);
			}
		}
	}
	
	/** 重新加载 */
	function reLoad($treemenu, jsonObj, mousemove, deep) {
		$treemenu.find("#store-selector").html("");
		init($treemenu, mousemove, deep);
		treeMenuBuild("root", "", jsonObj, $treemenu);
	}

})(jQuery);